<template>
  <PageableTable auto-height :data="dataList" header-bold hide-on-single-page :selection="false">
    <TableColumn label="办理人" prop="personalName" />
    <TableColumn label="办理环节" prop="activityName" />
    <TableColumn label="办理类型" prop="typeName" />
    <TableColumn label="办理时间" prop="time" />
    <TableColumn label="办理意见" prop="message" />
  </PageableTable>
</template>

<script>
  import { getFlowLogs } from '@/api/admin/workitem'

  export default {
    name: 'FlowLog',
    inject: {
      flowContext: {
        default: {}
      }
    },
    props: {
      businessKey: String,
      fetch: {
        type: Boolean,
        default: true
      }
    },
    data() {
      return {
        dataList: []
      }
    },
    watch: {
      businessKey: {
        immediate: true,
        handler: 'loadData'
      },
      'flowContext.logs': {
        immediate: true,
        deep: true,
        handler(newVal) {
          this.dataList = newVal
        }
      }
    },
    methods: {
      async loadData() {
        if (this.fetch && this.businessKey) {
          const { data } = await getFlowLogs(this.businessKey)
          this.dataList = data.data
        }
      },
      async reload() {
        await this.loadData()
      }
    }
  }
</script>
